<div>
    <div class="cart-box">
        <div class="nb">
            <div class="cart-step">
                <ul>
                    <li class="cart1"><i></i>购物车</li>
                    <li class="cart2 oncart2"><i></i>确认订单</li>
                    <li class="cart3"><i></i>付款</li>
                    <li class="cart4"><i></i>支付成功</li>
                </ul>
            </div>
            <div class="add-deliver">
                <div class="cart-title">
                    <h3><span>收货人信息</span></h3>
                </div>
                <div class="sh-address">
                    <ul>
                        <li class="add-add">
                            <div class="add-box add-box-center" @click="addAddr()">
                                <a href="javascript:void(0);">
                                    <i class="icon-add-add"></i>
                                    添加新地址
                                </a>
                            </div>
                        </li>
                        <li :class="calAddress(addr)" v-for="(addr, index) in userAddresses"  @click="selectAddress(addr)">
                            <div class="inner-infos">
                                <div class="addr-hd"><span>{{addr.areaName}}（{{addr.username}}）</span></div>
                                <div class="addr-bd"><span></span><span>{{addr.address}}{{addr.tel}}</span></div>
                                <a title="删除"
                                   style="color: brown;"  @click="deleteAddress(addr)">删除</a>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="goods-infor">
                <div class="cart-title">
                    <h3><span>商品信息</span>
                    <a v-if="nowBuyProductId == ''" href="/pageLR.html#/pages/plateform/cart" class="vivi-blue">返回购物车修改</a></h3>
                </div>
                <div class="goods-table">
                    <div class="goods-thead">
                        <div class="col col1">
                            商品
                        </div>
                        <div class="col col3">
                            单价
                        </div>
                        <div class="col col4">
                            数量
                        </div>
                        <div class="col col5">
                            小计
                        </div>
                    </div>
                    <div class="goods-tbody">
                        <div class="goodinfor" v-for="(prod, index) in orderInfo.prods">
                            <div class="col col1 goods-title-pic">
                                <a :href="'/page.html#/pages/plateform/productDetail?productId=' + prod.productId"><img :src="prod.coverPhoto" width="60"
                                        height="60"></a>
                                <div class="goods-describ elli">
                                    <p><a :href="'/page.html#/pages/plateform/productDetail?productId=' + prod.productId">{{prod.prodName}}</a>
                                    </p>
                                    <p></p>
                                </div>
                            </div>
                            <div class="col col3 goods-price"> ￥{{prod.ownerPrice}} </div>
                            <div class="col col4 good-num"> {{prod.goodsNum}} </div>
                            <div class="col col5 orange-bold xiaoji" style="border-bottom: none;"> ￥{{prod.goodsNum *
                                prod.ownerPrice}} </div>
                        </div>

                    </div>
                </div>
            </div>

            <div class="style-zhifu">
                <div class="cart-title">
                    <h3><span>支付方式</span>（提交订单之后也可对公转账）</h3>
                </div>
                <div class="zhifu-box">
                    <div class="zhifu-box">
                        <ul class="zfb" id="paylist">
                            <li>
                                <i class="icon-check-zf" style="display: block;"></i>
                                <a href="javascript:void(0);" id="wxpay_native" class="selected"><img
                                        src="../img/wxpay_native.png">微信扫码支付</a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="style-zhifu">
                    <div class="cart-title">
                        <h3><span>配送方式</span></h3>
                    </div>
                    <div class="zhifu-box">
                        <ul class="zfb" id="expresslist">
                            <li><i class="icon-check-zf" style="display: block;"></i><a href="javascript:void(0);"
                                    id="11" class="selected">系统默认</a></li>
                        </ul>
                    </div>
                </div>
                <div class="fare-result">
                    <div class="cart-title">
                        <h3><span>结算信息</span></h3>
                    </div>
                    <div class="result-box">
                        <ul>
                            <li class="first">
                                <div class="calu-box">
                                    <p class="slivergrey"><span><b class="orange-bold">{{orderInfo.totalNum}}</b> 件商品
                                            总计：</span><span class="txtmoney">￥<b>{{orderInfo.totalMount}}</b></span></p>
                                    <p class="slivergrey"><span>运费：</span><span class="txtmoney">￥<b
                                                id="expfee">0.00</b></span></p>
                                </div>
                            </li>
                            <li>
                                <div class="lside">
                                    <p class="save-passw"><span class="slivergrey">输入支付密码：</span><input type="password"
                                            id="cbkpaypwd"></p>
                                </div>
                                <div class="rside">
                                    <div class="lside">
                                        <p><span class="slivergrey">应付金额：</span><span class="orange-bold big">￥<b
                                                    id="payAmount">{{orderInfo.totalMount}}</b></span></p>
                                        <!-- <p class="vivi-blue">提交订单后尽快支付，商品才不会被人抢走哦！</p> -->
                                    </div>
                                    <a href="javascript:void(0);" class="btn-jiesuan" @click="_createOrder(orderInfo.shopId)">提交订单</a>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="edit-address modbox">
        <div class="edit-box">
            <h3>新增收货信息<i class="close-modbox" v-on:click="closeTips()"></i></h3>
            <div class="edit-form">
                <ul>
                    <li>
                        <label><i>*</i>收货人：</label>
                        <input type="text" id="sh-name" v-model="addAddressInfo.username" maxlength="20" class="s-length">
                    </li>
                    <li>
                        <label><i>*</i>手机号码：</label>
                        <input type="text" id="sh-phone" v-model="addAddressInfo.tel" maxlength="11" class="s-length">
                    </li>
                    <li style="min-height: 25px;">
                        <label style="width: 75px; float: left;"><i>*</i>所在地区：</label>
                        <!--                        <input type="text" id="sh-district"  v-model="addAddressInfo.areaName" maxlength="30" class="l-length">-->
                        <select  class="layui-input " style="width: 20%;display: inline;background: white;margin-left: 3px"
                                 v-model="addAddressInfo.selectProv" @change="getProv(addAddressInfo.selectProv)">
                            <option value='' disabled selected style='display:none;'>
                                {{vc.i18n('请选择省','register')}}
                            </option>
                            <option v-for="(item,index) in provs" :label="item.areaName" :value="item.areaCode">
                                {{item.areaName}}
                            </option>
                        </select>
                        <select  class="layui-input " style="width: 20%;display: inline;background: white;"
                                 v-model="addAddressInfo.selectCity"
                                 @change="getCity(addAddressInfo.selectCity)">
                            <option value='' disabled selected style='display:none;'>
                                {{vc.i18n('请选择城市','register')}}
                            </option>
                            <option v-for="(item,index) in citys" :label="item.areaName" :value="item.areaCode">
                                {{item.areaName}}
                            </option>
                        </select>
                        <select  class="layui-input " style="width: 20%;display: inline;background: white;"
                                 v-model="addAddressInfo.selectArea"
                                 @change="getArea(addAddressInfo.selectArea)">
                            <option value='' disabled selected style='display:none;'>
                                {{vc.i18n('请选择区县','register')}}
                            </option>
                            <option v-for="(item,index) in areas" :label="item.areaName" :value="item.areaCode">
                                {{item.areaName}}
                            </option>
                        </select>

                    </li>
                    <li style="clear: both;">
                        <label><i>*</i>详细地址：</label>
                        <input type="text" id="sh-address"  v-model="addAddressInfo.address" maxlength="30" class="l-length">
                    </li>
                    <li style="clear: both;">
                        <label>邮政编码：</label>
                        <input type="text" id="sh-postcode"  v-model="addAddressInfo.postalCode" maxlength="6" class="l-length">
                    </li>
                </ul>
                <div class="setting">
                    <input type="checkbox" value="1" id="isdefault"  v-model="addAddressInfo.isDefault" >&nbsp;&nbsp;设为默认地址
                </div>
                <button class="btn-save" id="saveconsignee" @click="saveAddressInfo();">保存</button>
            </div>
        </div>
    </div>

     <div id="mask"></div>
</div>
